<template>
  <div>
    <div class="app-container">
      <el-form size="mini" ref="postForm" :inline="true" :model="postForm" :label-position="'right'" label-width="80px">
        <el-row type="flex" justify="space-between" :gutter="20">
          <el-form-item/>
          <el-form-item>
            <el-button v-if="!isShow" type="warning" size="mini" @click="centerDialogVisible2=true">
              新增
            </el-button>
          </el-form-item>
        </el-row>
      </el-form>
      <el-table :height="tableHeight" :data="tableData" stripe border width="100%">
        <el-table-column type="index" align="center" width="50"></el-table-column>
        <el-table-column prop="type" label="表名称" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.type==1">粉尘分散度原始记录</span>
            <span v-if="scope.row.type==2">分光光度原始记录</span>
            <span v-if="scope.row.type==3">离子色谱原始记录</span>
            <span v-if="scope.row.type==4">粉尘原始记录</span>
            <span v-if="scope.row.type==5">原子荧光光度计原始记录</span>
            <span v-if="scope.row.type==6">原子吸收原始记录</span>
            <span v-if="scope.row.type==7">游离二氧化硅原始记录</span>
            <span v-if="scope.row.type==8">气相色谱原始记录-新</span>
          </template>
        </el-table-column>
        <el-table-column prop="jcxm" label="检测项目" align="center"/>
        <el-table-column prop="syrq" label="收样日期" align="center"/>
        <el-table-column prop="jcrq" label="检测日期" align="center"/>
        <el-table-column prop="jcyj" label="检测依据" align="center"/>
        <el-table-column prop="type" label="完成状态" align="center">
          <template slot-scope="scope">
            <span v-if="scope.row.schedule==1">未完成</span>
            <span v-if="scope.row.schedule==2">已更新</span>
          </template>
        </el-table-column>
        <el-table-column fixed="right" label="操作" width="80">
          <template slot-scope="scope">
            <el-button type="text" size="small" @click="showInfo(scope.$index,scope.row)">
              查看
            </el-button>
            <el-button v-if="!isShow" type="text" size="small"
                       @click="del(scope.$index,scope.row)">删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <el-dialog :visible.sync="centerDialogVisible2" center append-to-body modal-append-to-body width="40%">
        <el-form size="mini" :label-position="'right'"
                 label-width="80px">
          <el-form-item label="表类型:" prop="type">
            <el-radio-group v-model="type">
              <el-row style="padding: 5px">
                <el-radio :label="1">粉尘分散度原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="2">分光光度原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="3">离子色谱原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="4">粉尘原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="5">原子荧光光度计原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="6">原子吸收原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="7">游离二氧化硅原始记录</el-radio>
              </el-row>
              <el-row style="padding: 5px">
                <el-radio :label="8">气相色谱原始记录-新</el-radio>
              </el-row>
            </el-radio-group>
          </el-form-item>
        </el-form>
        <div slot="footer" class="dialog-footer">
          <el-button size="mini" @click="centerDialogVisible2 = false">取 消</el-button>
          <el-button size="mini" type="primary" @click="add()">确 定</el-button>
        </div>
      </el-dialog>
      <el-dialog
        :visible.sync="centerDialogVisible"
        center
        modal-append-to-body
        append-to-body
        width="96%"
      >
        <table61 v-if="type==1" ref="table61" :isShow="isShow" :no-created="true"/>
        <table62 v-if="type==2" ref="table62" :isShow="isShow" :no-created="true"/>
        <table63 v-if="type==3" ref="table63" :isShow="isShow" :no-created="true"/>
        <table64 v-if="type==4" ref="table64" :isShow="isShow" :no-created="true"/>
        <table65 v-if="type==5" ref="table65" :isShow="isShow" :no-created="true"/>
        <table66 v-if="type==6" ref="table66" :isShow="isShow" :no-created="true"/>
        <table67 v-if="type==7" ref="table67" :isShow="isShow" :no-created="true"/>
        <table68 v-if="type==8" ref="table68" :isShow="isShow" :no-created="true"/>

      </el-dialog>
    </div>
  </div>
</template>

<script>
import table61 from '@/views/table/table6-1'
import table62 from '@/views/table/table6-2'
import table63 from '@/views/table/table6-3'
import table64 from '@/views/table/table6-4'
import table65 from '@/views/table/table6-5'
import table66 from '@/views/table/table6-6'
import table67 from '@/views/table/table6-7'
import table68 from '@/views/table/table6-8'


import {getTable6List, getInfo, del} from '@/api/table/tableSix'
import fileUpdate from '@/components/Upload/fileUpdate'
import {getUserId} from '@/utils/auth'

export default {
  components: {
    fileUpdate,
    table61, table62, table63, table64, table65, table66, table67, table68
  },
  props: {
    noCreated: {
      type: Boolean,
      default: null
    },
    isShow: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      tableHeight: window.innerHeight - 180,
      qiniuDataObj: {token: ''},
      fileUrl: process.env.VUE_APP__FILE_URL,
      // 总条数
      total: 0,
      type: 1,
      // 每页显示个数
      pageSize: 15,
      // 页码
      currentPage: 1,
      // 查询条件
      postForm: {},
      // 查询条件
      selectForm: {},
      // 列表数据
      tableData: [],
      userId: getUserId(),
      typeList: [],
      // 编辑下标
      editIndex: 0,
      // 是否展示表单
      centerDialogVisible: false,
      centerDialogVisible2: false,
      // 表单标题
      title: null,
      table1Id: null,
      // 银行
      rules: {
        rewards: [{required: true, message: '请输入内容', trigger: 'chang'}],
        tagName: [{required: true, message: '请输入内容', trigger: 'chang'}],
        claim: [{required: true, message: '请输入内容', trigger: 'chang'}],
        name: [{required: true, message: '请输入内容', trigger: 'chang'}],
        taskTypeId: [{required: true, message: '你选择内容', trigger: 'chang'}],
        dataJson: [{required: true, message: '请上传文件', trigger: 'chang'}]
      }
    }
  }
  ,
  created() {
    if (!this.noCreated) {
      this.getData()
    }
  }
  ,
  methods: {
    handleSizeChange(val) {
      this.pageSize = val
    }
    ,
    // 初始化
    init(id, userId) {
      this.table1Id = id
      this.getData()
    }
    ,
    add() {
      this.centerDialogVisible = true
      this.centerDialogVisible2 = false
      this.$nextTick(() => {
        if (this.type == 1) {
          this.$refs.table61.init(null, this.table1Id)
        }
        if (this.type == 2) {
          this.$refs.table62.init(null, this.table1Id)
        }
        if (this.type == 3) {
          this.$refs.table63.init(null, this.table1Id)
        }
        if (this.type == 4) {
          this.$refs.table64.init(null, this.table1Id)
        }
        if (this.type == 5) {
          this.$refs.table65.init(null, this.table1Id)
        }
        if (this.type == 6) {
          this.$refs.table66.init(null, this.table1Id)
        }
        if (this.type == 7) {
          this.$refs.table67.init(null, this.table1Id)
        }
        if (this.type == 8) {
          this.$refs.table68.init(null, this.table1Id)
        }
      })
    }
    ,
    // 分页查询
    handleCurrentChange(val) {
      this.currentPage = val
      this.getData()
    }
    ,
    // 查询条件
    query() {
      this.selectForm = this.postForm
      this.currentPage = 1
      this.getData()
    }
    ,
    getData() {
      // 请求分页参数
      getTable6List(this.table1Id).then(response => {
        this.tableData = response.data
      })
    }
    ,
    // 查看
    showInfo(index, row) {
      this.type = row.type
      this.editIndex = index
      this.centerDialogVisible = true
      this.$nextTick(() => {
        if (row.type == 1) {
          this.$refs.table61.init(row.id, null)
        }
        if (row.type == 2) {
          this.$refs.table62.init(row.id, null)
        }
        if (row.type == 3) {
          this.$refs.table63.init(row.id, null)
        }
        if (this.type == 4) {
          this.$refs.table64.init(row.id, null)
        }
        if (this.type == 5) {
          this.$refs.table65.init(row.id, null)
        }
        if (this.type == 6) {
          this.$refs.table66.init(row.id, null)
        }
        if (this.type == 7) {
          this.$refs.table67.init(row.id, null)
        }
        if (this.type == 8) {
          this.$refs.table68.init(row.id, null)
        }
      })
    }
    ,
    // 删除
    del(index, row) {
      this.$confirm('是否删除该数据', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        del(row.id).then(response => {
          this.getData()
          this.$notify({
            title: '成功',
            message: '操作成功',
            type: 'success',
            duration: 2000
          })
        })
      })
    }
  }
}
</script>

